<!DOCTYPE HTML>
<html>
<head>
  <script type="text/javascript" src="../tools/ace/build/src/ace-uncompressed.js"></script>
  <script type="text/javascript" src="../acesupport/acemode/auto_brace_insert.js"></script>
  <script type="text/javascript" src="../acesupport/acemode/r_highlight_rules.js"></script>
  <script type="text/javascript" src="../acesupport/acemode/tex_highlight_rules.js"></script>
  <script type="text/javascript" src="../acesupport/acemode/r.js"></script>
  <script type="text/javascript" src="../acesupport/acemode/r_scope_tree.js"></script>
  <script type="text/javascript" src="../acesupport/acemode/r_code_model.js"></script>
  <style type="text/css">
  pre {
    margin-bottom: 30px;
    padding: 3px;
    border: 1px solid #999;
  }
  </style>
</head>
<body>

<h2>Interactive Tester</h2>
<input id="funcName" type="text" readonly="true" style="width: 598px; border: 1px solid #999; margin-bottom: 12px"/><button onclick="updateLabel();">Update</button>
<div id="editor" style="width: 600px; height: 300px; border: 1px solid #999">foo {
a <- function(b=function() { }) {

}
}</div>


<script type="text/javascript">
var RCodeModel = require('mode/r_code_model').RCodeModel;
var Document = require('ace/document').Document;
require('mode/auto_brace_insert').setInsertMatching(true);

var editor = ace.edit('editor');
editor.renderer.setHScrollBarAlwaysVisible(false);
editor.setHighlightActiveLine(false);
var RMode = require('mode/r').Mode;
var mode = new RMode(false, editor.getSession().getDocument());
editor.getSession().setMode(mode);
function updateLabel() {
  var mgr = mode.codeModel;
  var fname = mgr.getCurrentScope(editor.getSession().getSelection().getCursor()).label;
  document.getElementById('funcName').value = fname;
}

editor.getSession().getSelection().on("changeCursor", function() {
  setTimeout(updateLabel, 0);
});
updateLabel();
</script>
</body>
</html>
